<!DOCTYPE html>
<html lang="en" style="height:100%">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>TA的关注</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../../css/yzl.css" />
    <!-- <link rel="stylesheet" href="../../css/BarlowCondensed-Bold.woff.ttf" /> -->
    <!-- <link rel="stylesheet" href="../../css/sqc.css"> -->
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        input{

            outline:none;
        }
        .blacklist-people ul li .blacklist-head-datas .active_style{
            color: #F95656;
            border: 1px solid #F95656;
        }
    </style>
</head>

<body style="background: #fff;">
<div id="blank" class="header" v-cloak style="border-bottom: 1px solid #f7f4f2;">
    <div v-back.tapmode class="back"></div>
    <div class="title">{{api.pageParam.target_id== getPrefs('member_id')? '我的关注': 'TA的关注'}}</div>
</div>
<div id="app"  v-cloak style="padding-top:60px;">
    <div class="blacklist-people">
        <ul>
            <li v-for="(list, index) in lists">
                <div class="blacklist-head">
                    <img :src="list.member_avatar">
                </div>
                <div class="blacklist-head-datas">
                    <span class="blacklist-title" style="font-size: 15px;margin-bottom: 2px;">{{list.nickname}}</span>
                    <div class="blacklist-title" style="font-size: 12px;color: #999;">
                        动态：<span>{{list.dynamic_number}}</span>
                        <span class="particulars-line"></span>
                        粉丝：<span>{{list.fans_number}}</span>
                    </div>
                    <div class="recovery" v-show="list.member_id != getPrefs('member_id')" :class="{'active_style' : list.attent_flag == 0}" v-myclick="[list.member_id,takefollow]">
                        {{list.attent_flag==1?'已关注':'关注'}}
                    </div>
                </div>
            </li>
        </ul>
        <div  style="text-align:center;margin-top:50px" v-show="lists.length<=0">
            <img src="../../image/big/guanzhu.png" style="margin:0 auto;width:25%">
            <div style="margin:0 auto;color:#999999;text-align:center;padding-top:20px;font-size:12px">TA还没有任何关注</div>
        </div>
    </div>
</div>
</body>
<script src="../../script/api.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/url.js"></script>
<script src="../../script/components.js"></script>
<script type="text/javascript" src="../../script/jquery.js"></script>

<script>
    var vm,
        lists;
    apiready = function () {
        setBSImg();
        new Vue({
            el: '#blank'
        })
        wx = api.require('wx');
        var data = {
            browse_member_id: getPrefs('member_id'),
            other_member_id: api.pageParam.target_id,
            page_no:1,
            page_size:20,
            flag:1
        };
        var callback = function (ret) {
          lists = ret.content;
          console.log(JSON.stringify(lists))
          initApp();
        };
        pinet.post(APIURL+'/app/dynamic/attentOrFansList', data, callback);
        api.parseTapmode();
    };

    function initApp() {
        // var isBigImg = Vue.BSImg == 'big';
        vm = new Vue({
            el: '#app',
            data: {
              lists:lists
            },
            computed: {

            },
            methods: {
              reload_info:function(){
                var data = {
                    browse_member_id: getPrefs('member_id'),
                    other_member_id: api.pageParam.target_id,
                    page_no:1,
                    page_size:20,
                    flag:1
                };
                var callback = function (ret) {
                  vm.lists = ret.content;
                };
                pinet.post(APIURL+'/app/dynamic/attentOrFansList', data, callback);
              },
              takefollow:function(member_id){
                  if(!hasPrefs('token')){
                      api.toast({
                          msg: '请登录',
                          duration: 2000,
                          location: 'middle'
                      });
                      return;
                  }
                var data = {
                    member_id: getPrefs('member_id'),
                    attention_member_id: member_id,
                };
                var callback = function (ret) {
                  vm.reload_info();
                  api.toast({
                      msg: ret.message,
                      duration: 2000,
                      location: 'middle'
                  });

                };
                pinet.post(APIURL+'/app/dynamic/attention', data, callback);
              }
            },
            watch: {

            },
        })
    }


</script>

</html>
